
/******************************************************************
GENERAL
******************************************************************/


/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
 
html{height:100%;margin:0;padding:0;}
 
body {height: 100%;margin:0;padding:0;font-family:"Montserrat",sans-serif; letter-spacing:.1em;}

ul{list-style-type:none;margin:0;padding:0;}

a{text-decoration:none;color:#000000;}
a:visited{text-decoration:none;color:#000000;}




/******************************************************************
*******************************************************************
MOBILE
*******************************************************************
******************************************************************/
.loading{
	z-index:100001;
	position:fixed;
	bottom:20px;
	right:20px;
	width:200px;
	margin: 0;
}
.loading img{width:100%; height:auto;}

/******************************************************************
MENU
******************************************************************/

#main-menu{
	width:100%;
	height:100%;
	position:absolute;
	bottom:0; right:0;
	padding:20px;
	z-index:100001;
	}

#main-menu a:link{text-decoration:none;color:black;}
#main-menu a:visited{text-decoration:none;color:black;}	
#main-menu a:hover{z-index:100003;text-decoration:none;color:#000;}	
#main-menu a:active{z-index:100003;text-decoration:none;color:#000000;}	


#main-menu ul{
	list-style:none;
	margin:0 !important;
	text-align:left;
	font-size:18px;
	line-height:24px;
	}

#main-menu ul li{
	}	

#main-menu ul li a{
	display:block;
	width:100%;
	}

#menu-screen{
	display:none;
	width:100%;
	height:100%;
	top:0;left:0;
	position:fixed;
	z-index:100001;
}

.what{background: url('https://31.media.tumblr.com/a98d89f35929dda0236d6ff4511693c9/tumblr_nbhzjdfLp71te3cnao1_1280.jpg')}
.newsletter{background:rgb(237, 193, 180);display:block !important;}
.contact{background:rgb(255, 249, 234);display:block !important;}
.book{background:rgb(226, 230, 207);display:block !important;}
.hide{opacity:0;}
        
#what-link{
    position: fixed; 
    top: 20px; 
    left: 20px;    
    }
   
#newsletter-link{
    position: fixed; 
    top: 20px; 
    right: 20px;    
    }
        
#contact-link{
    position: fixed; 
    bottom: 20px; 
    left: 20px;    
    }
        
#book-link{
    position: fixed; 
    right: 20px; 
    bottom: 20px;    
    }
  
#close-button{
	width:20px;
	height:20px;
	position:fixed;
	top:20px;
	right:20px;
	z-index:100004;
	background:url('img/close-20px.png');
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size:contain; 
	background-repeat:no-repeat;
	}



/******************************************************************
SLIDESHOW
******************************************************************/

.wrapper {
width:100%;
height:100%;
display:block; 
margin:0px auto 0px;
}

/******************************************************************
 SLIDESHOW NAV ***************************************************/

.cycle-next{z-index:101; position:absolute;width:50%;top:0;margin-top:-20px;right:10px;opacity:.5;text-align:right;height:100%;cursor:url(img/right.png),auto;}
.cycle-prev{z-index:101; position:absolute;width:50%;top:0;margin-top:-20px;left:20px;opacity:.5;text-align:left;height:100%;cursor:url(img/left.png),auto;}
.cycle-next:hover, .cycle-prev:hover{opacity:.5;}


/******************************************************************
 PAGES ***********************************************************/

.page{position:relative;width:100%;height:100%;padding:60px;z-index:20001;}

.fullpage{
	position:relative;
	width:100%;
	height:100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size:cover; 
	background-repeat:no-repeat;
	background-position:center center;
}

.index{
	position:relative;
	width:100%;
	height:100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size:cover; 
	background-repeat:no-repeat;
	background-position:center bottom;
}

/******************************************************************
SLIDESHOW GRID ***********************************************************/

.image-area{
height:100%;
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size:contain; 
background-repeat:no-repeat;
}

.full-width{width:100%;padding:0px;}

.off-width{width:80%;}

.centred{background-position:center center;}

.top-left{background-position:top left;position:absolute;top:0px;left:0px;	}

.top-right{background-position:top right;position:absolute;top:0px;right:0px;}

.bottom-right{background-position:bottom right;position:absolute;bottom:0px;right:0px;}

.bottom-left{background-position:bottom left;position:absolute;bottom:0px;left:0px;}

.video{
	width:100%;
	height:100%;
	position:relative;
	z-index:101 !important;
}

.video iframe{
	position:absolute;
	width:300px;
	height:169px;
	top:50%;left:50%;
	margin: -85px 0 0 -150px;
	background:rgb(237, 193, 180);
}

/******************************************************************
ABOUT PAGE
******************************************************************/

	.images{
		width:240px;
		margin:20px 20px 0px;
	}
	
	.images img{
		width:100%;
		height:auto;
		margin-bottom:20px;
	}

	.text{
		margin:0 60px 20px 20px;
		padding:0 0 40px;
		text-align:justify;
		font-size:18px;
		line-height:21px;
		-webkit-hyphens: auto;
	  	-moz-hyphens: auto;
	  	-ms-hyphens: auto;
	  	hyphens: auto;
	}
	
	.text p{
		margin:0 0 20px;
	}


/******************************************************************
CHAIRS AND STOOLS PAGE
******************************************************************/

.chairs .images{
	float:left;
	width:240px; 
	margin:10px;
}

.chairs .images{
	text-align:left;
	padding:0px;

}

.chairs .images img.portrait{
	padding:0;
	height:auto;
	width:46%;
	margin:2%;
}

.chairs .images img.landscape{
	width:96%;
	padding:0;
	height:auto;
	margin:2%;
	}

.chairs .images img{
	width:auto;
	float:left;
	display:inline;
}

/******************************************************************
CONTACT
******************************************************************/

.contact a:hover{text-decoration:none;color:rgb(255, 159, 91);}
	

/******************************************************************
*******************************************************************
LARGE PHONE
*******************************************************************
******************************************************************/
@media only screen and (min-width: 400px) {

.chairs .images{
	width:320px; 
}/*end 400px*/

@media only screen and (min-width: 500px) {


.chairs .images{
	width:410px; 
}
	
}/*end 500px*/

@media only screen and (min-width: 550px) {

	.loading{
		z-index:100001;
		position:fixed;
		top:50%;
		left:50%;
		width:250px;
		margin: -125px 0 0 -125px;
	}	
	
/******************************************************************
MENU
******************************************************************/

	#main-menu{
		width:640px;
		height:36px;
		position:fixed;
		bottom:20px; right:75px;
		z-index:100001;
		font-size:20px;
		padding:0;
		}

	#main-menu ul{
		list-style:none;
		text-align:right;
		}

		#main-menu ul li{
			display:inline-block;
			height:45px;
			}	

		#main-menu ul li a{
			padding-left:30px;
			width:100%;
			height:100%;
			display:inline-block;
			}
}/*end 550px*/



@media only screen and (min-width: 600px) {



/******************************************************************
CHAIRS AND STOOLS PAGE
******************************************************************/

.chairs .images{
	float:left;
	width:564px; 
	margin:15px;
}

.chairs .images{
	text-align:left;
	padding:0px;

}

.chairs .images img.portrait{
	padding:0;
	height:auto;
	width:23%;
	margin:1%;
}

.chairs .images img.landscape{
	width:48%;
	padding:0;
	height:auto;
	margin:1%;
	}

.chairs .images img{
	width:auto;
	float:left;
	display:inline;
}



/******************************************************************
PROCESS
******************************************************************/


.video iframe{
	position:absolute;
	width:450px;
	height:254px;
	top:50%;left:50%;
	margin: -127px 0 0 -225px;
}

	
}/*end Lrg Phone*/



/******************************************************************
*******************************************************************
IPAD
*******************************************************************
******************************************************************/

@media only screen and (min-width: 768px) {


.loading{
	z-index:100001;
	position:fixed;
	top:50%;
	left:50%;
	width:350px;
	margin: -175px 0 0 -175px;
}
.loading img{width:100%; height:auto;}




/******************************************************************
ABOUT PAGE
******************************************************************/

	.images{
		width:40%;
		margin:0;
		padding:170px 60px 20px 20px;
		float:right;
	}

	.images img{
		width:100%;
		height:auto;
		margin-bottom:20px;
	}

	.text{
		width:60%;
		float:left;
		margin:0;
		padding:20px 20px 40px;
		text-align:left;
		font-size:23px;
		line-height:26px;
		-webkit-hyphens: none;
	  	-moz-hyphens: none;
	  	-ms-hyphens: none;
	  	hyphens: none;
	}

	.text p{
		margin:0 0 20px;
	}

/******************************************************************
CHAIRS AND STOOLS PAGE
******************************************************************/

.chairs .images{
	width:675px; 
}
	
/******************************************************************
PROCESS
******************************************************************/


.video iframe{
	position:absolute;
	width:600px;
	height:338px;
	top:50%;left:50%;
	margin: -169px 0 0 -300px;
}	
	
}/*end IPAD*/





/******************************************************************
******************************************************************
SMALL DESKTOP
******************************************************************
******************************************************************/

@media only screen and (min-width: 960px) {




/******************************************************************
SLIDESHOW GRID ***********************************************************/

.page{position:relative;width:100%;height:100%;padding:80px 80px 80px;}


.half-left{width:50%;height:100%;padding:200px 15px;float:left;}
.half-right{width:50%;height:100%;padding:200px 15px;float:right;}


.full-left{width:50%;height:100%;padding:0px 15px 0px 0px;float:left}
.full-right{width:50%;height:100%;padding:0px 0px 0px 15px;float:right}
.full{width:100%;height:100%;padding:0px;float:left;}

.quarter-left{width:50%;height:50%;padding:15px;float:left;}
.quarter-right{width:50%;height:50%;padding:15px;float:right;}


.fullpage .quarter-left, .fullpage .quarter-right{ }



/******************************************************************
MENU
******************************************************************/

#close-button{
	width:39px;
	height:39px;
	position:fixed;
	top:20px;
	right:20px;
	z-index:100004;
	background:url('img/close-39px.png');
	}
	

/******************************************************************
ABOUT PAGE
******************************************************************/

	.images{
		width:45%;
		padding:100px 60px 20px 50px;
	}

	.about .images img{
		max-width:300px;
	}

	.text{
		width:55%;
	}



/******************************************************************
CHAIRS AND STOOLS PAGE
******************************************************************/

	.chairs .images{
		float:left;
		width:745px; 
		margin:10px 200px 20px 10px;
	}

	.chairs .images{
		text-align:left;
		padding:0px;

	}

	.chairs .images img.portrait{
 		padding:0;
		height:auto;
		width:23%;
		margin:1%;
	}

	.chairs .images img.landscape{
		width:48%;
		padding:0;
		height:auto;
		margin:1%;
		}

	.chairs .images img{
		width:auto;
		float:left;
		display:inline;
	}

/******************************************************************
PROCESS
******************************************************************/


.video iframe{
	position:absolute;
	width:650px;
	height:366px;
	top:50%;left:50%;
	margin: -183px 0 0 -325px;
}	
	
}/*End Small Desktop*/


/******************************************************************
******************************************************************
MEDIUM DESKTOP
******************************************************************
******************************************************************/

@media only screen and (min-width: 1200px) {







/******************************************************************
MENU
******************************************************************/

#main-menu ul{
	font-size:22px;
	line-height:24px;
	}
	
	

/******************************************************************
ABOUT PAGE
******************************************************************/

	.text{
		padding:40px;
		font-size:26px;
		line-height:30px;

	}

	.text p{
		margin:0 0 26px;
	}

/******************************************************************
CHAIRS AND STOOLS PAGE
******************************************************************/

.chairs .images{
	float:left;
	width:1000px; 
	margin:10px 200px 20px 10px;
}

/******************************************************************
PROCESS
******************************************************************/


.video iframe{
	position:absolute;
	width:699px;
	height:393px;
	top:50%;left:50%;
	margin: -197px 0 0 -350px;
}	

	
}/*End Medium Desktop*/